<template>
  <div class="container">
    <div class="wrap_box">
      <div class="title">
        <i class="shu"></i>
        <span>客户 [6个月数据]</span>
      </div>
      <div class="body">
        <div class="flex">
          <span class="flex-item">到店</span>
          <span>{{real_info.num}}次</span>
        </div>
        <div class="flex">
          <span class="flex-item">消费</span>
          <span>{{real_info.yeji}}元</span>
        </div>
      </div>
    </div>
    <div class="wrap_box">
      <div class="title">
        <i class="shu"></i>
        <span>机构设置 [6个月数据]</span>
      </div>
      <div class="body">
        <div class="flex">
          <span class="flex-item">A类 [到店{{type_info.A_arrive}}次以上,消费{{type_info.A_money}}元以上]</span>
        </div>
        <div class="flex">
          <span class="flex-item">B类 [到店{{type_info.B_arrive}}次以上,消费{{type_info.B_money}}元以上]</span>
        </div>
        <div class="flex">
          <span class="flex-item">C类 [到店{{type_info.C_arrive}}次以上,消费{{type_info.C_money}}元以上]</span>
        </div>
        <div class="flex">
          <span class="flex-item">D类 [到店{{type_info.D_arrive}}次以上,消费{{type_info.D_money}}元以上]</span>
        </div>
        <div class="flex">
          <span class="flex-item">E类 [到店{{type_info.E_arrive}}次以上,消费{{type_info.E_money}}元以上]</span>
        </div>
        <div class="flex">
          <span class="flex-item">F类 [到店{{type_info.E_arrive}}次以下,消费{{type_info.E_money}}元以下]</span>
        </div>
      </div>
    </div>
    <picker @change="change" :value="index" :range="array" :range-key="'name'">
      <view class="picker">
        <div class="update">修改</div>
      </view>
    </picker>
  </div>
</template>

<script>
import wx from 'wx'
import api from '@/utils/api'
import Toast from '@/utils/toast'
export default {
  data () {
    return {
      guest_id: '',
      real_info: {},
      type_info: {},
      system_type: '',
      array: [
        {
          type: 'A',
          name: 'A类客户'
        },
        {
          type: 'B',
          name: 'B类客户'
        },
        {
          type: 'C',
          name: 'C类客户'
        },
        {
          type: 'D',
          name: 'D类客户'
        },
        {
          type: 'E',
          name: 'E类客户'
        },
        {
          type: 'F',
          name: 'F类客户'
        }
      ],
      index: 0
    }
  },
  components: {
  },
  async onLoad () {
    const that = this
    // 接收客户id
    that.guest_id = that.$route.query.id
    that.get_info()
  },
  methods: {
    async get_info () {
      const that = this
      const userInfo = wx.getStorageSync('userInfo')
      const res = await api.getguesttypeinfo({
        guest_id: that.guest_id,
        orcode: userInfo['orcode']
      })
      if (res.code === '100') {
        that.real_info = res.realinfo
        that.type_info = res.type_info
        if (res.realinfo.num >= res.type_info.A_arrive && res.realinfo.yeji >= res.type_info.A_money) {
          that.system_type = 'A'
          return false
        } else if (res.realinfo.num >= res.type_info.B_arrive && res.realinfo.yeji >= res.type_info.B_money) {
          that.system_type = 'B'
          return false
        } else if (res.realinfo.num >= res.type_info.C_arrive && res.realinfo.yeji >= res.type_info.C_money) {
          that.system_type = 'C'
          return false
        } else if (res.realinfo.num >= res.type_info.D_arrive && res.realinfo.yeji >= res.type_info.D_money) {
          that.system_type = 'D'
          return false
        } else if (res.realinfo.num >= res.type_info.E_arrive && res.realinfo.yeji >= res.type_info.E_money) {
          that.system_type = 'E'
          return false
        } else {
          that.system_type = 'F'
          return false
        }
      }
    },
    async change (e) {
      /* eslint-disable */
      const that = this
      const pages = getCurrentPages()
      const prevPage = pages[pages.length - 2]
      const lv = that.array[e.mp.detail.value]['type']
      const jsonstring = JSON.stringify({ lv: lv })
      const res = await api.postguesttype({
        guest_id: that.guest_id,
        addinfo: jsonstring
      })
      if (res.code === '100') {
        prevPage.data.$root['0'].guest_info.lv = lv
        Toast('更新成功', 'noicon')
      } else {
        Toast('更新失败', 'noicon')
      }
    }
  }
}
</script>

<style scoped>
.wrap_box {
  width: 100%;
  box-shadow: 0 6rpx 20rpx rgba(255, 68, 68, 0.1);
  background-color: rgba(255, 255, 255, 1);
  margin-bottom: 18rpx;
}
.wrap_box .title {
  padding: 28rpx 0 28rpx 34rpx;
  font-size: 32rpx;
  font-weight: bold;
  color: rgba(51, 51, 51, 1);
}
.wrap_box .body {
  padding-left: 48rpx;
}
.wrap_box .body > div {
  height: 80rpx;
  padding-right: 46rpx;
  font-size: 28rpx;
  color: rgba(102, 102, 102, 1);
  border-bottom: 2rpx solid rgba(153, 153, 153, 0.1);
}
.wrap_box .body > div:last-child {
  border-bottom: none;
}
.shu {
  display: inline-block;
  width: 4rpx;
  height: 20rpx;
  background: rgba(255, 68, 68, 1);
  border-radius: 2rpx;
  margin-right: 12rpx;
}
.update {
  margin-top: 90rpx;
  width: 270rpx;
  height: 80rpx;
  background: #ff4444;
  border-radius: 48rpx;
  line-height: 80rpx;
  color: #fff;
  font-size: 36rpx;
  font-weight: 400;
  text-align: center;
}
</style>